let vm = new Vue({
    el: '.main-content',
    data: function () {
        return {
            setting: {
                data: {
                    simpleData: {
                        enable: true,
                        pIdKey: "parentId"
                    },

                }, callback: {
                    onClick: this.onClick
                },
                view: {
                    fontCss: this.fontCss
                }
            },
            nodes: [],
            role: {},
            yxUsers: [],
            yxIds: [],
            yxBtn: false,
            oid: '',
            dxUsers: [],
            dxIds: [],
            dxBtn: false

        }
    },

    methods: {
        selectRole: function (id) {
            axios({
                url: `mapper/userList/selectById`,
                params: {rid: id}
            }).then(response => {
                //拿到id
                this.yxUsers = response.data.obj;
                for (let i in this.yxUsers) {
                    //设置默认不选中
                    this.yxUsers[i].checked = false;
                }
            }).catch(error => {
                layer.msg(error.message)
            })
        },
        checkYxUsers: function (id) {
            for (let i in this.yxUsers) {
                if (id == this.yxUsers[i].id) {
                    this.yxUsers[i].checked = !this.yxUsers[i].checked;
                    //选中
                    if (this.yxUsers[i].checked) {
                        this.yxIds.push(id);
                        this.yxBtn = true;
                        return;
                    } else {
                        //取消选中
                        for (let j in this.yxIds) {
                            if (this.yxIds[j] == id) {
                                this.yxIds.splice(j, 1)
                            }
                        }
                    }
                }
            }
            if (this.yxIds.length == 0) {
                this.yxBtn = false;
            }
        },
        deleteBatch: function () {
            axios({
                url: `mapper/role/deleteBatch`,
                params: {rid: this.role.id, ids: this.yxIds + ''}
            }).then(response => {
                layer.msg(response.data.msg);
                if (response.data.success) {
                    //刷新页面
                    this.initData();
                    this.selectRole(this.role.id);
                    this.selectNoRole();
                }
            }).catch(error => {
                layer.msg(error.message)
            })
        },
        insertBatch: function () {
            axios({
                url: `mapper/role/insertBatch`,
                params: {rid: this.role.id, cids: this.dxIds + ''},
            }).then(response => {
                layer.msg(response.data.msg);
                if (response.data.success) {
                    //刷新页面
                    this.initData();
                    this.selectRole(this.role.id);
                    this.selectNoRole();
                }
            }).catch(error => {
                layer.msg(error.message)
            })
        },
        selectNoRole: function () {
            axios({
                url: `mapper/userList/selectNoRole`,
                params: {rid: this.role.id, oid: this.oid}
            }).then(response => {
                //拿到id
                this.dxUsers = response.data.obj;
                for (let i in this.dxUsers) {
                    //设置默认不选中
                    this.dxUsers[i].checked = false;
                }
            }).catch(error => {
                layer.msg(error.message)
            })
        },
        checkDxUsers: function (id) {
            for (let i in this.dxUsers) {
                if (id == this.dxUsers[i].id) {
                    this.dxUsers[i].checked = !this.dxUsers[i].checked;
                    //选中
                    if (this.dxUsers[i].checked) {
                        this.dxIds.push(id);
                        this.dxBtn = true;
                        return;
                    } else {
                        //取消选中
                        for (let j in this.dxIds) {
                            if (this.dxIds[j] == id) {
                                this.dxIds.splice(j, 1)
                            }
                        }
                    }
                }
            }
            if (this.dxIds.length == 0) {
                this.dxBtn = false;
            }

        },
        initData: function () {
            this.yxUsers = [];
            this.yxIds = [];
            this.yxBtn = false,
                this.dxUsers = [],
                this.dxIds = [],
                this.dxBtn = false
        },
        initTree: function () {
            //初始化nodes数据
            axios({
                url: `mapper/office/selectAll`
            }).then(response => {
                this.nodes = response.data.obj;
                let zTreeObj = $.fn.zTree.init($("#treeOffice"), this.setting, this.nodes);
            }).catch(error => {
                layer.msg(error.message)
            })

        },
        onClick: function (event, treeId, treeNode) {
            let zTreeObj = $.fn.zTree.getZTreeObj("treeOffice");  //根据树id获取树对象
            //获取所有树节点，多维结构
            let nodes = zTreeObj.getNodes();
            //转换成一维结构
            nodes = zTreeObj.transformToArray(nodes);

            //还原所有高亮属性为false
            for (let i in nodes) {
                nodes[i].highLight = false;
                zTreeObj.updateNode(nodes[i]);
            }
            treeNode.highLight = true;//设置高亮
            zTreeObj.updateNode(treeNode);//更新节点
            this.oid = treeNode.id;
            this.selectNoRole();//查询公司待选人员

        },
        fontCss: function (treeId, treeNode) {
            // 根据高亮标记设置高亮红色
            return treeNode.highLight ? {color: 'red'} : {color: 'black'};
        },


    },
    created: function () {
        this.initTree();
        this.role.id = parent.layer.roleId;
        this.role.name = parent.layer.roleName;
        this.selectRole(this.role.id);
    }
});